<template>
    <div class="checkTakeList">
        <van-nav-bar left-text="返回" title="盘查记录" left-arrow @click-left="onClickLeft">
        </van-nav-bar>
        <van-cell-group>
            <van-field v-model="checkTime" readonly label="盘查月份" placeholder="请选择月份" @click="handleCheckTime" />
        </van-cell-group>
        <van-popup v-model:show="showCheckTime" position="bottom">
            <van-datetime-picker v-model="currentDate" type="year-month" :max-date="maxDate" :min-date="minDate"
                :formatter="formatter" @confirm="timeConfirm" />
        </van-popup>
        <van-list style="width: 100%;" :finished="finished" finished-text="没有更多了" @load="onLoad">
            <van-loading v-if="loading" size="24px" color="#1890ff" vertical>加载中...</van-loading>
            <div v-else style="display: flex;flex-direction: column;padding: 15px; gap: 20px;">
                <van-cell style="border-radius: 20px;"  v-for="item in checkList" :key="item.id">
                    <template #default>
                        <div class="blue-bar"></div>
                        <div style="padding:0 18px 18px 18px;display: flex;flex-direction: column;gap: 10px;">
                            <div><span style="font-weight: bold;font-size: 16px;">资产标签号：</span>{{ item.equipmentId }}</div>
                            <div><span style="font-weight: bold;font-size: 16px;">资产名称：</span>{{ item.equipmentName }}</div>
                            <div><span style="font-weight: bold;font-size: 16px;">盘查人员：</span>{{ item.checkPersonName }}</div>
                            <div><span style="font-weight: bold;font-size: 16px;">盘查时间：</span>{{ item.createTime }}</div>
                            <div><span style="font-weight: bold;font-size: 16px;">是否合格：</span>
                                <van-tag plain type="primary" size="large" v-if="item.checkResult">合格</van-tag>
                                <van-tag plain type="danger" size="large" v-else>不合格</van-tag>
                            </div>
                            <div style="margin-top: 10px; width: 100%;">
                                <van-button round block="" type="primary" size="small" @click="handleDetails(item.id)">查看详情</van-button>
                            </div>
                        </div>
                    </template>
                </van-cell>
            </div>
        </van-list>
    </div>
</template>

<script setup>
import EquipmentEditApi from "../equipmentEdit/api/equipmentEdit"
import { ref, onMounted } from "vue"
import { parseTime } from "../../utils/index"
import { useRouter,useRoute} from "vue-router";
import _ from "lodash";
const onClickLeft = () => history.back();
const router = useRouter();

const route =useRoute()
const pageSize = ref(10)
const pageIndex = ref(1)
const loading = ref(false)
const finished = ref(false);
const showCheckTime = ref(false)
const currentDate = ref(new Date())
const minDate = new Date(2024, 0, 1)
const maxDate = new Date()
const checkTime = ref(parseTime(currentDate.value, "{y}-{m}"))
const checkList = ref([])

// const isAdmin=store.get
onMounted(() => {
    loading.value = true

})
const handleDetails=(id)=>{
    ///equipmentCheckDetails
    router.push({
        path:"/equipmentCheckDetails",
        query:{
            id
        }
    })
}
const formatter = (type, value) => {
    if (type === 'year') {
        return `${value}年`;
    } else if (type === 'month') {
        return `${value}月`
    }
    return value;
}
const handleCheckTime = () => {
    showCheckTime.value = true
}
const getCheckList = () => {
    EquipmentEditApi.equipmentcheckByCond({ searchTime: parseTime(currentDate.value, "{y}-{m}") }, pageSize.value, pageIndex.value).then(res => {
        loading.value = false
        if (res.data.code == 200) {
            checkList.value=checkList.value.concat(res.data.data.list);
            if (!res.data.data.nextPage) {
                finished.value = !res.data.data.nextPage;
                return;
            }
            pageIndex.value += 1;
        }
    }).catch(error => {
        loading.value = false
        if (error.message !== "") {
            Toast.fail(error.message);
        }
        reject(error);

    })
}

const timeConfirm = (value) => {
    currentDate.value = parseTime(new Date(value), '{y}-{m}')
    checkTime.value = currentDate.value
    showCheckTime.value = false
    pageIndex.value=1
    checkLis.value=[]
    getCheckList()
}
const onLoad = _.debounce(() => {
  
    getCheckList()
}, 1000);
</script>
<style>
.checkTakeList {
    background: #ebedf0;
    height: 100vh;
    overflow-y: scroll;
    overflow-x: hidden;
}

.blue-bar {
    background: #1989fa;
    width: 2px;
    height: 16px;
    display: inline-block;
    position: absolute;
    top: 3px;
    border-radius: 5px;
}
</style>